/**
 * Created by Administrator on 2019/9/19.
 */

var city = "沧州";
function  c(){
    var w;
    w = new XMLHttpRequest();
    w.onreadystatechange = function(){
        if (w.readyState == 4 && w.status == 200){
            var res = JSON.parse(w.responseText);
            console.log(res);
                for(var i = 0; i < res.daily_forecast.length;i++){
                    document.querySelector("#city").innerHTML = res.basic.city;
                    document.querySelector("#cnty").innerHTML = res.basic.cnty;
                    //天气
                    var txt = document.querySelectorAll(".txt");
                    txt[i].innerHTML = res.daily_forecast[i].cond.txt_d;
                    var date = document.querySelectorAll(".date");
                    date[i].innerHTML = res.daily_forecast[i].date;
                    var max = document.querySelectorAll(".max");
                    max[i].innerHTML = res.daily_forecast[i].tmp.max;
                    var min = document.querySelectorAll(".min");
                    min[i].innerHTML = res.daily_forecast[i].tmp.min;
                    var dir = document.querySelectorAll(".dir");
                    dir[i].innerHTML = res.daily_forecast[i].wind.dir;
                    var sc = document.querySelectorAll(".sc");
                    if (res.daily_forecast[i].wind.sc == "1-2"){
                        res.daily_forecast[i].wind.sc = "<3";
                        sc[i].innerHTML = res.daily_forecast[i].wind.sc;
                    }else {
                        sc[i].innerHTML = res.daily_forecast[i].wind.sc;
                    }
                }
                for(var j = 0; j < res.hourly_forecast.length;j++){
                    var tmp =document.querySelectorAll(".tmp");
                    tmp[j].innerHTML = res.hourly_forecast[j].date.slice(11,16);
                    var cond_txt = document.querySelectorAll(".cond_txt");
                    cond_txt[j].innerHTML = res.hourly_forecast[j].cond.txt;
                    var wind_dir = document.querySelectorAll(".wind_dir");
                    wind_dir[j].innerHTML = res.hourly_forecast[j].wind.dir;
                    var wind_sc = document.querySelectorAll(".wind_sc");
                    if (res.hourly_forecast[j].wind.sc == "1-2"){
                        res.hourly_forecast[j].wind.sc = "<3";
                        wind_sc[j].innerHTML = res.hourly_forecast[j].wind.sc;
                    }else {
                        wind_sc[j].innerHTML = res.hourly_forecast[j].wind.sc;
                    }
                }
                document.querySelector("#uv").innerHTML = res.suggestion.uv.brf;
                document.querySelector("#uvtxt").innerHTML = res.suggestion.uv.txt;
                document.querySelector("#sport").innerHTML = res.suggestion.sport.brf;
                document.querySelector("#sporttxt").innerHTML = res.suggestion.sport.txt;
                document.querySelector("#trav").innerHTML = res.suggestion.trav.brf;
                document.querySelector("#travtxt").innerHTML = res.suggestion.trav.txt;
                document.querySelector("#drsg").innerHTML = res.suggestion.drsg.brf;
                document.querySelector("#drsgtxt").innerHTML = res.suggestion.drsg.txt;
                document.querySelector("#cw").innerHTML = res.suggestion.cw.brf;
                document.querySelector("#cwtxt").innerHTML = res.suggestion.cw.txt;
                document.querySelector("#air").innerHTML = res.suggestion.air.brf;
                document.querySelector("#airtxt").innerHTML = res.suggestion.air.txt;
                var momo = document.querySelectorAll(".mdb-top span");
                var fsd = document.querySelector(".fsd");
                var fs = document.querySelector(".mdb-fsd");
                var sh = document.querySelector(".mdb-ft");
                for(var l = 0 ;l < momo.length;l++){
                    momo[l].onclick = liew ;
                }
                function liew(){
                    var z = true;
                        for(var i = 0; i < momo.length;i++){
                            if(momo[i] == this){
                                momo[i].className = "momo";
                                sh.style.display = "block";
                                fs.style.display = "none";
                            }else {
                                momo[i].className = "fsd";
                                fs.style.display = "block";
                                sh.style.display = "none";
                            }
                        }
                    }

        }
    };
    w.open("GET","https://bird.ioliu.cn/weather?city="+ city ,true);
    w.send();
}
c();
document.querySelector("#ipt").addEventListener('change',function(){
    console.log(this.value);
    city = this.value;
    c();
});